<template>
  <section>
    <section v-if="detail && sourceFlag" @click="goWhichDetail(1)" class="share-content">
      <div class="icon" v-if="sharePhotoOss && tools.indexOfHttp(sharePhotoOss)"><img :src="sharePhotoOss" alt=""></div>
      <div class="icon" v-else-if="sharePhoto && sharePhoto !== ''"><img :src="getPicher(sharePhoto)" alt=""></div>
      <div class="icon" v-if="!sharePhoto && false"><></div>
      <div class="title">{{shareContentTitle}}</div>
    </section>
    <section v-if="!sourceFlag && branchData" @click="goWhichDetail(2)" class="share-content">
      <div class="icon" v-if="sharePhotoOss && tools.indexOfHttp(sharePhotoOss)"><img :src="sharePhotoOss" alt=""></div>
      <div class="icon" v-else-if="sharePhoto && sharePhoto !== ''"><img :src="getPicher(sharePhoto)" alt=""></div>
      <div class="icon" v-if="!sharePhoto && false"><></div>
      <div class="title">{{shareContentTitle}}</div>
    </section>
  </section>
</template>

<script>
import tools from "@/utils/tools";
  export default {
    name: 'shareContentInFriend',
    props: ['newsId', 'source', 'friendShare', 'shareContentTitle', 'sharePhoto','sharePhotoOss'],
    data () {
      return {
        detail: {},
        branchData: {},
        sourceFlag: true
      }
    },
    created () {
      this.loadData()
    },
    methods: {
      goDetail (data) {
        let routerName = 'videoDetail'
        this.$store.state.newsDetail = data.newsContent
        this.$store.state.videoDetail = data.newsContent
        if (data.newsContentExt.contents && data.newsContentExt.contents.length > 100) {
          routerName = 'redCloudNewsDetail'
        }
        if (this.source == 7) {
          console.log(data)
          routerName = 'groupInfoDetail'
          return this.$router.push({name: routerName, query: {id: data.newsContent.id}})
        }
        // 0:新闻，1:视频；6:音频
        if (this.source == 1) {
          this.$store.state.isVideo = true
        } else if (this.source == 6) {
          this.$store.state.isVideo = false
        }
        this.$router.push({name: routerName, params: {id: data.newsContent.id}, query: {id: data.newsContent.id, channelName: '红友圈分享'}})
      },
      goBranchDetail (data) {
        if (this.source === '3') {
          this.$router.push({name: `albumsDetail`, query: {id: data.id, index: -1}})
        } else if (this.source === '4') {
          this.goMemorabiliasDetail(data, -1)
        } else if (this.source === '5') {
          this.goMemorabiliasDetail(data, -1)
        }
      },
      getPoster (item) {
        return this.tools.getImgUrl(item.sharePhoto)
      },
      getPicher (fileId) {
        return this.tools.getImgUrl(fileId)
      },
      loadData () {
        // 来源（0 新闻 1 视频 2 支部大事记 3 支部相册 4 学习体会 5 学习资料 6 红云FM 7 组工信息 ）
        if (this.source === '3' || this.source === '4' || this.source === '5') {
          this.sourceFlag = false
          this.branchData = this.friendShare
        } else if (this.source === '7') {
          this.sourceFlag = true
          this.detail = this.friendShare
        } else {
          this.sourceFlag = true
          this.detail = this.friendShare
        }
      },
      loadBranchData () {
        let data = {
          loginId: this.tools.getUserInfo().id || '112029',
          spaceId: this.newsId
        }
        this.fetchService.spaceInfoDetail(data).then(res => {
          if (res.code !== 0) {
            return this.tools.tip(res.message)
          }
          console.log('---------result={}', res.data)
          // this.branchData = res.data
          // this.detail = res.data
          // this.$store.state.newsDetail = res.data
          // this.canEdit = res.data.editPower || false
          this.goBranchDetail(res.data)
        })
      },
      goMemorabiliasDetail (item, index) {
        // 外部链接直接打开，不用支持编辑及删除 汤达 2020年6月26日14:45:29
        if (item.externalUrl) {
          this.saveSpaceInfoRead(item.id)
          return this.loadUrl(item.externalUrl)
        }
        this.$router.push({path: `/branchMemorabiliaDetail/${item.id}/${index}`})
      },
      saveSpaceInfoRead (id) {
        let data = {
          loginId: '112029',
          spaceId: id
        }
        this.fetchService.saveSpaceInfoRead(data).then(res => {
          if (res.code !== 0) {
            return this.tools.tip(res.message)
          }
        })
      },
      loadUrl (url) {
        window.android && window.android.openUrlAdapt && window.android.openUrlAdapt(url)
      },
      goNewsDetail () {
        let id = this.newsId
        this.fetchService.contentPageDetail(id).then(res => {
          if (res.code !== 0) {
            return false
          }
          this.goDetail(res.data)
        })
      },
      goZuGongDetail () {
        let id = this.newsId
        this.fetchService.groupInfoContentInfo(id).then(res => {
          if (res.code !== 0) {
            return false
          }
          res.data.id = res.data.contentId
          let data = {
            newsContent: res.data,
            newsContentExt: {}
          }
          this.goDetail(data)
        })
      },
      goWhichDetail (which) {
        if (which === 1) {
          if (this.source === '7') {
            this.goZuGongDetail()
          } else {
            this.goNewsDetail()
          }
        } else {
          this.loadBranchData()
        }
      }
    }
  }
</script>

<style scoped lang="scss">
  @import "@/common/stylus/moon.scss";
  .share-content {
    margin-top:10px;
    display:flex;
    justify-content: flex-start;
    align-items:center;
    background-color: $bg-color;
    font-size:$tipFontSize;
    color:#333;
    padding:10px;
    line-height:1.2em;
    .title {
      font-size:$titleFontSize;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      overflow: hidden;
    }
    .icon {
      color:#fff;
      padding:0 10px;
      height:120px * 6 / 9;
      width:120px;
      text-align: center;
      margin-right:20px;
      background-color: darken($bg-color, 1.5);
      position: relative;
      flex-shrink:0;
      overflow:hidden;
      img {
        width:100%;
        position: absolute;
        top:50%;
        left:0;
        transform:translateY(-50%);
      }
    }
  }
</style>
